<script setup>
</script>
<template>
  <div>
    <div class="common-layout">
      <el-container>
        <el-aside width="200px">
          <el-menu
            default-active="2"
            class="el-menu-vertical-demo"
            @open="handleOpen"
            @close="handleClose"
            active-text-color="#007761"
          >
          <div class="logo">
            <img src="../../static/u233.png" width="100%" alt="">
          </div>
            <el-sub-menu index="1">
              <template #title>
                <el-icon><location /></el-icon>
                <span>智能监控</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="1-1">item one</el-menu-item>
                <el-menu-item index="1-2">item two</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
            <el-sub-menu index="2">
              <template #title>
                <el-icon><location /></el-icon>
                <span>车辆管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="2-1">item one</el-menu-item>
                <el-menu-item index="2-2">item two</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
            <el-sub-menu index="3">
              <template #title>
                <el-icon><location /></el-icon>
                <span>人员管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="3-1">item one</el-menu-item>
                <el-menu-item index="3-2">item two</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
            <el-sub-menu index="4">
              <template #title>
                <el-icon><location /></el-icon>
                <span>安全管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="4-1">item one</el-menu-item>
                <el-menu-item index="4-2">item two</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
            <el-sub-menu index="5">
              <template #title>
                <el-icon><location /></el-icon>
                <span>能耗管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="5-1">item one</el-menu-item>
                <el-menu-item index="5-2">item two</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
            <el-sub-menu index="6">
              <template #title>
                <el-icon><location /></el-icon>
                <span>洗车洗盒</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="6-1">item one</el-menu-item>
                <el-menu-item index="6-2">item two</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
            <el-sub-menu index="7">
              <template #title>
                <el-icon><location /></el-icon>
                <span>资产管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="7-1">item one</el-menu-item>
                <el-menu-item index="7-2">item two</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
            <el-sub-menu index="8">
              <template #title>
                <el-icon><location /></el-icon>
                <span>园区管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="8-1">item one</el-menu-item>
                <el-menu-item index="8-2">item two</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
            <el-sub-menu index="9">
              <template #title>
                <el-icon><location /></el-icon>
                <span>系统设置</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="9-1">item one</el-menu-item>
                <el-menu-item index="9-2">item two</el-menu-item>
              </el-menu-item-group>
            </el-sub-menu>
          </el-menu>
        </el-aside>
        <el-main>
            <div class="navtopse">

            </div>
            <div>
                
            </div>
        </el-main>
      </el-container>
    </div>
  </div>
</template>
<style scoped>

.common-layout{
    height: 100vh;
    background-color: aqua;
}
.el-aside{
    height: 100vh;
    background-color: white;
}
.el-main{
    margin: 0;
    padding: 0;
    background-color: rgb(244, 247, 247);
}
li.el-menu-item:hover{
    background-color: rgba(0, 0, 0, 0)!important;
}
.el-sub-menu .el-sub-menu__title:hover{
    background-color: rgba(0, 0, 0, 0)!important;
}
.logo{
    box-sizing: border-box;
    padding: 20px;
}
.navtopse{
    width: 100%;
    height: 66px;
    background-color:  rgb(244, 247, 247);
    position: fixed;
    top: 0;
}
</style>